<template>
  <div>
    <el-badge
      v-for="(item, index) in total"
      :value="index > 8 ? index + 1 : '0' + (index + 1)"
      :key="index"
      class="item"
      @click.native="onCurrentPage(index)"
      :type="
        index == currentPage
          ? 'primary'
          : answerSheet[index]
          ? answerSheet[index].trueOrFalse
            ? 'success'
            : 'danger'
          : 'info'
      "
    >
    </el-badge>
  </div> 
</template>

<script>
import { mapState, mapMutations } from "vuex";
export default {
  data() {
    return {};
  },
  methods: {
    ...mapMutations("test/study", ["SELECT_QUESTION"]),
    onCurrentPage(index) {
      this.SELECT_QUESTION(index);
    },
  },
  computed: {
    ...mapState("test/study", ["total", "currentPage", "answerSheet"]),
  },
};
</script>

<style scoped>
.item{
  cursor: pointer;
}
</style>